<ng-container *ngIf="(slelctedTabLink$ | async) as tap">
  <!-- (slelctedTabLink$ | async) as tap 将这个流 async pipe后当做一个常量，在里面可以使用 -->
  <ng-container *ngIf="tap === 'hot'">
    <app-image-slider #appSliders [sliders]="sliders"></app-image-slider>
    <app-horizontal-grid [(username)]="username">
    <span appGridItem *ngFor="let item of channels$ | async">
      <img [src]="item.icon" alt="" appGridItemImage [appGridItemImageWidth]="'3rem'">
      <span appGridTitle [fontSize]="'1em'">{{item.title}}</span>
    </span>
    </app-horizontal-grid>
  </ng-container>
</ng-container>

<div class="ad-container" *ngIf="ad$ | async as ad">
  <img class="ad-image" [src]="ad.imageUrl" alt="">
</div>
<app-vertical-grid [width]="'20rem'" [height]="'2rem'">
  <!-- <div>hello</div>
  <div>world</div> -->
  <!-- {{ slelctedTabLink$ | async | json }}
  {{ products$ | async | json }} -->
    <app-product-card 
    [product]="item" 
    *ngFor="let item of products$ | async"
    [routerLink]="['/products', item.id]"
    routerLinkActive="router-link-active"
    ></app-product-card>
</app-vertical-grid>
<app-toast-info *ngIf="show"></app-toast-info>

